<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>个人中心</title>
    <script type="text/javascript" src="../static/js/jquery-3.6.0.js"></script>
<!--    <script type="text/javascript" src="../static/js/info.js"></script>-->
    <script type="text/javascript" src="../static/js/logout.js"></script>
    <link rel="stylesheet" href="../static/css/all.css" type="text/css"/>
    <link rel="stylesheet" href="../static/css/user.css" type="text/css"/>
    <link rel="stylesheet" href="../static/css/navigation.css" type="text/css"/>
    <link rel="stylesheet" href="../static/css/info.css" type="text/css"/>
    <link rel="stylesheet" href="../static/css/background.css" type="text/css"/>
    <style type="text/css">
        .info table tr .left {
            text-align: right;
            padding: 4px 10px;
            font-size: 20px;
        }
        .right input{
            text-align: left;
            padding-left: 6px;
            background: none;
            height: 30px;
            width: 300px;
            margin: 4px 0;
        }
        input[type="text"]{
            border-radius: 10px;
            border: 1px solid slategray;
        }
        #head_pic{
            width: 40px;
            height: 40px;
        }
    </style>
</head>
<body class="body">
<div class="menu">
    <span class="font_title">个人中心</span>
    <span class="user"></span>
</div>
<div class="navigation">
    <ul class="navigationBar">
        <li><a href="/foodCity">浏览美食</a></li>
        <li><a href="/shoppingCart">购物车</a></li>
        <li><a href="/goOrder">我的订单</a></li>
        <li><a href="/info">我的</a></li>
    </ul>
</div>
<div class="info">
    <table border="1" class="info_tab">
        <tr>
            <td class="left">用户名：</td>
            <td class="right"><input type="text" name="username"/></td>
        </tr>
        <tr>
            <td class="left">登入账号：</td>
            <td class="right"><input type="text" name="login"/></td>
        </tr>
        <tr>
            <td class="left">密码：</td>
            <td class="right"><input type="text" name="password"/></td>
        </tr>
        <tr>
            <td class="left">头像：</td>
            <td class="right"><img src="" id="head_pic" alt=""></td>
        </tr>
        <tr>
            <td class="left">姓名：</td>
            <td class="right"><input type="text" name="name"/></td>
        </tr>
        <tr>
            <td class="left">性别：</td>
            <td class="right"><input type="text" name="sex"/></td>
        </tr>
        <tr>
            <td class="left">创建时间：</td>
            <td class="right"><input type="text" name="created"/></td>
        </tr>
        <tr>
            <td class="left">地区：</td>
            <td class="right"><input type="text" name="address"/></td>
        </tr>
        <tr>
            <td class="left">手机号：</td>
            <td class="right"><input type="number" name="phone"/></td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="button" value="修改信息" id="modifyInformation"/>
            </td>
        </tr>
    </table>
</div>
</body>
<script type="text/javascript">
    $(function () {
        $.ajax({
            url: "/getUser",
            method: "get",
            dataType: "json",
            success: function (rs) {
                if (rs.user != null) {
                    $(".user").append("欢迎你：" + rs.user.username + "，<a href='#' onclick='logout()'>注销</a>");
                    //个人信息填入
                    $("input[name='username']").val(rs.user.username);
                    $("input[name='login']").val(rs.user.login);
                    $("input[name='password']").val(rs.user.password);
                    $("input[name='name']").val(rs.user.name);
                    $("input[name='sex']").val(rs.user.sex);
                    $("input[name='created']").val(new Date(rs.user.created));
                    $("input[name='address']").val(rs.user.address);
                    $("input[name='phone']").val(rs.user.phone);
                    $("#head_pic").attr("src", rs.user.headPic);
                    console.log(rs.user.headPic)
                } else {
                    //$(".user").append("<a href='#' onclick='showLogin()'>登录</a>查看更多内容");
                    alert("请先登录查看个人中心");
                    window.location = "/foodCity"
                }
            }
        });
    })
</script>
</html>